... this.db .collection(uid, (ref) => { console.log('ref', ref); return ref.where('year', '==', '1954').orderBy('lastName'); }) .snapshotChanges() ...Esto produce el error:
ERROR TypeError: Cannot read properties of undefined (reading 'length') at MatTableDataSource._filterData (table.js:725)Cuando profundizo en el módulo de la tabla en node_modules en @angular/material/ ivy_ngcc /fesm2015/table.js:
/** * Returns a filtered data array where each filter object contains the filter string within * the result of the filterTermAccessor function. If no filter is set, returns the data array * as provided. */ _filterData(data) { // If there is a filter string, filter out data that does not contain it. // Each data object is converted to a string using the function defined by filterTermAccessor. // May be overridden for customization. this.filteredData = (this.filter == null || this.filter === '') ? data : data.filter(obj => this.filterPredicate(obj, this.filter)); if (this.paginator) { console.log('this.filteredData', this.filteredData); this._updatePaginator(this.filteredData.length); } return this.filteredData; } si uso .orderBy o where, o cualquier otra consulta por sí misma, this.filteredData devuelve la matriz de datos filtrados, como se esperaba. Pero si trato de usar múltiples consultas, como en el ejemplo anterior con .where().orderBy() entonces this.filteredData devuelve undefined.
¿Alguien tiene idea de por qué puede ser esto?
Estaba seguro de que tenía algo que ver con el lugar donde MatPagination y MatSort existen en los ganchos del ciclo de vida de Angular frente a cuándo/cómo se obtienen los datos de FireStore a través de AngularFire.
No.
Solo necesitaba crear un índice compuesto en FireStore Database -> Indexes. En este caso contiene los campos "año" y "apellido".
Me desconcertó porque no había el error tradicional con un enlace para indexarlo en firestore que generalmente se muestra en este tipo de escenario.